<template>
  <img class="module_img" :src="scr" :style="[module_style]" />
</template>
<script lang="ts">
export default {
  name: 'myImg',
}
</script>

<script setup lang="ts">
import { computed } from 'vue'
const props = defineProps({
  scr: String,

  width: {
    type: String,
    default: '100',
  },
  height: {
    type: String,
    default: '100',
  },
})

// 计算属性——既读取又修改
let module_style = computed(() => {
  let style = {}
  let P_WIDTH = Number(props.width)
  let P_HEIGHT = Number(props.height)
  if (P_WIDTH > 0) {
    style['width'] = `${P_WIDTH}px`
  }
  // if (mode == 'aspectFill') {
  if (P_HEIGHT > 0) {
    style['height'] = `${P_HEIGHT}px`
  } else {
    style['height'] = `auto`
  }
  // } else {
  //   style['height'] = `auto`
  // }
  // if (radius > 0) {
  // 	style['border-radius'] = `${radius}rpx`;
  // }
  return style
})
</script>
<style scoped lang="scss">
.module_img {
  object-fit: contain;
}
</style>
